<template>
  <div class="section_common">
    <div class="main">
      <el-form ref="form"  label-width="100px">
        <!--<el-form-item label="所属仓库" required>
          <el-select
            v-model="area"
            size="mini"
            placeholder="请选择所属仓库"
            v-on:change="czroom"
          >
            <el-option label="东莞仓" value="1"></el-option>
            <el-option label="上雪仓" value="2"></el-option>

          </el-select>
        </el-form-item>-->

        <el-form-item label="所属仓库" required>
          <el-radio-group v-model="area" v-on:change="czroom">
            <el-radio label="1">东莞仓</el-radio>
            <el-radio label="2">上雪仓</el-radio>
          </el-radio-group>

        </el-form-item>

        <el-form-item label="房号" required>
          <el-input v-model="room" size="mini" @change="checkRoom"></el-input>
        </el-form-item>
        <el-form-item label="姓名" required>
          <el-input v-model="name" size="mini"></el-input>
        </el-form-item>
        <!--<el-form-item label="性别" required>
          <el-select
            v-model="form.region"
            size="mini"
            placeholder="请选择所属仓库"
          >
            <el-option label="男" value="shenzhen"></el-option>
            <el-option label="女" value="hefei"></el-option>
          </el-select>
        </el-form-item>-->
        <el-form-item label="性别" required>
          <el-radio v-model="sex" label="男">男</el-radio>
          <el-radio v-model="sex" label="女">女</el-radio>
        </el-form-item>

        <el-form-item label="部门/岗位" required>
          <el-input v-model="dept" size="mini"></el-input>
        </el-form-item>
        <el-form-item label="入住时间" required>
          <el-date-picker
            size="mini"
            v-model="intime"
            type="date"
            placeholder="选择日期"
            :editable="false"
            value-format="yyyy-MM-dd"
          >
          </el-date-picker>
        </el-form-item>
        <el-form-item>
          <el-button type="primary" size="mini" @click="submitPost"
            >提交</el-button
          >
        </el-form-item>
      </el-form>
    </div>
  </div>
</template>

<script>
  import { Toast} from "vant";
export default {
  data() {
    return {
      area:"1",
      room:"",
      mid:"",
      name:"",
      dept:"",
      intime:"",
      sex:"男",
      minDate:new Date(new Date().getTime()-180*24*60*60*1000),
      msgcode:"",

      nowUser: '',
      title: "宿舍登记",

      addApplication: '/mobiles/addDormitory',

      date:"",
      exceptshow:false,
    };
  },
  created() {
    this.nowUser=JSON.parse(localStorage.getItem('userInfo')).userId;
  },
  methods: {
    czroom(){
      this.room='';
    },

    //校验填写的房间号是否存在
    checkRoom(){
      this.$https.post("/mobiles/checkRoom",{
        area:this.area,
        room:this.room,
      }).then(res => {
        if (res.data.code=='500'){
          this.msgcode='500';
          Toast(res.data.message);
        }else {
          this.msgcode="";
          this.mid=res.data.data.id;
        }

      }).catch(err => {
        console.log(err)
      });
    },

    // 返回
    goBack() {
      this.$router.go(-1);
    },
    // 提交
    submitPost() {
      if (!this.isNull()) return false;

      this.$https.post(this.addApplication, {
        nowUser:this.nowUser,
        sex:this.sex,
        room:this.room,
        name:this.name,
        dept:this.dept,
        intime: this.intime,
        mid:this.mid,

      }).then(res => {
        res;
        Toast("宿舍登记成功");
        this.$router.go(-1);
      }).catch(err => {
        console.log(err)
      });
    },
    //判断相关数据是否为空
    isNull() {
      if (this.area == '') {
        this.$toast("请选择区域");
        return false;
      }
      if (this.room=='') {
        this.$toast("房号不能为空");
        return false;
      }
      if (this.name=='') {
        this.$toast("姓名不能为空");
        return false;
      }
      if (this.dept=='') {
        this.$toast("部门/岗位不能为空");
        return false;
      }
      if (this.intime=='') {
        this.$toast("请选择入住日期");
        return false;
      }
      if (this.msgcode=='500'){
        this.$toast("房间号输入有误，请检查或联系管理员");
        return false;
      }
      if (this.mid==''){
        this.$toast("请重新输入房间号");
        return false;
      }
      return true;
    },
  },
};
</script>

<style lang="scss" scoped>
.main {
  display: flex;
  justify-items: center;
  margin: 0 auto;
  .el-form {
    padding-right: 10px;
    .el-form-item {
      .el-form-item__label {
        line-height: 16px;
      }
      margin-bottom: 5px;
    }
  }
}
</style>